<template>
	<view class="download">
		<view class="common-header">
		  <view class="back-box" @click="back()" v-if="from==1" >
				<image src="/static/images/backwhite.png" class="back" mode="" ></image>
			</view>
		</view>
		<block v-if="isWeixin">
			<view class="openguide-pop">
				<image src="/static/images/openguide.png" class="openguide-img" mode=""></image>
			</view>
			<image src="/static/images/downloadbg-fsm.png" class="downloadbg" mode="widthFix"></image>
		</block>
		
		<image src="/static/images/downloadbg-fsm.png" v-else class="downloadbg downloadbg-other" mode="widthFix" @click="downLoad"  ></image>
		<!-- <view class="down-logo-box">
			<image src="/static/images/downloadlogo.png" class="downloadlogo" mode=""></image>
		</view>
		<view class="bottom">
			<view class="circle"></view>
			<div class="downLoad-btn" @click="downLoad" >立即下载</div>
		</view> -->
		
	</view>
</template>

<script>
	import { versionChecking } from 'api/checkVersion.js';
	import Base64 from 'base-64';
	let date = new Date()
	let year = date.getFullYear()
	let month = date.getMonth() + 1;
	let day = date.getDate()
	let signNum = Base64.encode((year + month * 2 + day * 3) * 2)
	
	export default{
		data(){
			return {
				isWeixin:false,
				from:0,
				downAppAndroidUrl:''
			}
		},
		methods:{
			back(type){
				uni.navigateBack({});
			},
			isWeiXinLogin() {
				var ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/MicroMessenger/i) == 'micromessenger') {
					return true;
				} else {
					return false;
				}
			},
			downLoad(){
				if(this.isWeiXinLogin()){
					this.isWeixin = true
				}else{
					let platform=uni.getSystemInfoSync().platform
					if(platform=='ios'){
					  window.location.href = 'https://apps.apple.com/us/app/%E6%9C%89%E7%82%B9%E4%B8%9C%E8%A5%BF%E4%BC%9A%E5%91%98%E5%BA%97/id1619662735'
					}else if(platform=='android'){
					  window.location.href = this.downAppAndroidUrl;
						 // window.location.href = 'https://webcdn.m.qq.com/webapp/homepage/index.html#/appDetail?apkName=com.panda.ttthings&info=0445877AEDB48F9F1A17FE0BBB7C4591';
					}
				}
			    
			},
		},
		onShow() {
			uni.request({
			    url: this.httpHost + 'api/versions',
					header:{
						sign:signNum
					},
			    success: (res) => {
			        if(!res.message){
								this.downAppAndroidUrl = res.data.android_download_url
							}
			    }
			})
			if(this.isWeiXinLogin()){
				this.isWeixin = true
			}else{
				this.isWeixin = false
			}
		},
		onLoad(options) {
			if(options.from){
				this.from = options.from
			}
		}
	}
</script>

<style>
	.download{
		width: 100%;
		/* height:100vh; */
	}
	.openguide-pop{
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.5);
		position: fixed;
		top:0;
		left:0;
		z-index: 99;
	}
	.openguide-img{
		display: block;
		width: 564rpx;
		height: 378rpx;
		margin-left: 178rpx;
	}
	.downloadbg{
		width: 100%;
		/* height: 100%; */
		/* position: fixed;
		left:0;
		top:0; */
		z-index: -1;
	}
	.downloadbg-other{
		z-index:9;
	}
	.common-header{
		width: 750rpx;
		height: 88rpx;
		background: rgba(0,0,0,0);
		position: fixed;
		left:0;
		top: 0;
		z-index:9999;
		display: flex;
		align-items: center;
	}
	.bgColor{
		background: rgba(0,0,0,.2);
	}
	.back-box{
		width: 50rpx;
		height: 50rpx;
		background: rgba(255,255,255,.5);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: 20rpx;
	}
	.back{
		display: block;
		width: 30rpx;
		height: 30rpx;
	}
	.down-logo-box{
		padding-top:150rpx;
	}
	.downloadlogo{
		display: block;
		width: 640rpx;
		height: 538rpx;
		margin: 0rpx auto 0;
	}
	.bottom{
		width: 100%;
		height: 240rpx;
		background: #FFE066;
		position: absolute;
		left: 0;
		bottom: 0;
		overflow: hidden;
	}
	.circle{
		width: 100%;
		height: 88rpx;
		border-radius: 0 0 50% 50%/0 0 100% 100%;
		background: #FFFFFF;
		position: absolute;
		top:0;
		left:0;
	}
	.downLoad-btn{
		width: 580rpx;
		height: 88rpx;
		background: #333333;
		border-radius: 44rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		font-weight: 500;
		color: #FFFFFF;
		position: absolute;
		top:20rpx;
		left:50%;
		margin-left: -290rpx;
	}
</style>
